<template>

  <video  class="video-player-box" ref="media"
                 :src="audioUrl"
                  >
  </video>
</template>

<script>
  import { mapGetters } from 'vuex'

  export default {

    data() {
      return {
        playerOptions: {
          type: "video/mp4",
          src:'../../../static/mp3/01.mp3' ,
        },
        info:{},
      }
    },
    mounted() {
      this.$store.dispatch('set_AudioElement', this.$refs.media)
    },
    computed:{
      ...mapGetters([
        'getInfo'
      ]),
      audioUrl(){
        console.log(this.$store.state.audio.info);
        return this.$store.state.audio.info.url;
      }

    },
    methods: {
      // listen event
      onPlayerPlay() {
        console.log('点击暂停/播放');
      }
    },
    created(){
      // console.log('给audio元素存在vuex 的state里面  方便日后调用');
      // console.log(this.$refs.media);
      // 给audio元素存在vuex 的state里面  方便日后调用

    },
    watch:{
      getInfo:function () {

        // console.log('set playing');
        // this.$store.commit('setPlaying');
      }
    }
  }
</script>
